
        //将微信挂载在Window上的cloud挂载到vue实例上
        const c = window.cloud
        Vue.prototype.cloud = c
        Vue.config.productionTip = false //阻止vue在启动时生成生产提示
        Vue.config.devtools = true;
        //定义一个组件
        Vue.component("Banner-form", {
            props: ["item"],
            template: '<tr><td><input type="checkbox"></td><td>{{list[0]}}</td><td>{{list[1]}}</td><td>{{list[2]}}</td><td>{{list[3]}}</td><td><ul><li><a href="#">职位修改</a></li><li><a href="#">删除</a></li><li><a href="#">查看报名表</a></li></ul></td></tr>'
        })
        var vm = new Vue({
            el: "#root",
            data: {
                usersInfo: [], //储存显示的用户信息
                // userInfo 里的 item 的check 表示是否被选中
                select: "秘书处",
                openidArray: [],//储存选中的_openid
                /* ,
                inputValue: "好好学习，天天向上" */
                fileidArray: [], //
                downloadURL: [],
            },
            methods: {
                //配置微信
                async initWx() {
                    //创建新的cloud实例
                    var c1 = new this.cloud.Cloud({
                        identityless: true,
                        // 资源方 AppID 填自己的
                        resourceAppid: 'wx96f760966921f98a',
                        // 资源方环境 ID	填自己的
                        resourceEnv: 'cloud1-8g54d6xb74e96e7d'
                    })
                    //初始化,使用await将异步转化为同步
                    await c1.init()
                    console.log('初始化完成');
                    this.cloud = c1
                    this.db = this.cloud.database()
                },
                async getMessage(department = "秘书处") {
                    this.select = department
                    // 1.根据侧边栏的不同，然后获取不同部门的人员
                    /*1.写一个department参数，点击不同部门时传入不同参数
                        2.在方法中使用where分开 
                     */
                    this.db.collection("Users").where({
                        department: department
                    }).get().then(res => {
                        console.log(res);
                        var dataArray = res.data
                        var arraryLength = res.data.length
                        this.usersInfo.splice(0, this.usersInfo.length)
                        for (let i = 0; i < arraryLength; i++) {
                            this.usersInfo.push(dataArray[i])
                        }
                        console.log(this.usersInfo);
                    }
                    )


                }
                ,
                viewApplication(_openid) {
                    /*  1.先获取对应的openID，然后到willing表中查询其fileID
                        2.使用getTempFileURL获取下载路径，然后直接打开 */
                    this.db.collection("Willings").where({
                        _openid: _openid
                    }).get().then(res => {
                        //res ---> data数组
                        console.log(res);
                        this.cloud.getTempFileURL({
                            fileList: [res.data[0].fileID],
                            success: res => {
                                // get temp file URL
                                console.log(res)
                                window.open(res.fileList[0].tempFileURL, "_blank");
                            },
                            fail: err => {
                                // handle error
                            }
                        })
                    })

                },
                async exportApplication() {
                    /*  勾选思路，
                                    1.如果选中则向item添加select=true  √
                                    2.导出时遍历当前userInfo，拿到select为true的，然后储存在_openidArray √
                                    3.使用_openid查询到willing表中对应的,然后储存到fileidArray √
                                    4.遍历fileArrayID获得downloadURL √
                                    5.压缩
                                     */
                    console.log("点了");
                    // 将openidArray初始化
                    this.openidArray = []
                    for (let val of this.usersInfo) {
                        console.log("进来了");
                        if (val.check) {
                            console.log("修改后的");
                            this.openidArray.push(val._openid)
                        }
                    }
                    if (this.openidArray.length != 0) {
                        // console.log("选中");
                        // 3.使用_openid查询到willing表中对应的,然后储存到fileidArray  √
                        this.fileidArray = [] //初始化
                        for (let val of this.openidArray) {
                            await this.db.collection("Willings").where({
                                _openid: val
                            }).get().then(res => {
                                console.log(res);
                                this.fileidArray.push(res.data[0].fileID)
                            })
                        }
                        console.log(this.fileidArray);

                        //4.遍历fileArrayID获得downloadURL数组 √

                        // 一次最多50个
                        await this.cloud.getTempFileURL({
                            fileList: this.fileidArray,

                        }).then(res => {

                            // res => fileList(数组)=> tempFileURL
                            console.log(res);
                            var fileList = res.fileList
                            //初始化
                            this.downloadURL = []
                            for (let val of fileList) {
                                this.downloadURL.push(val.tempFileURL)
                            }
                            console.log("载入完成，downloadURL数组为");
                            console.log(this.downloadURL);

                        }).catch(error => {
                            console.log(error);
                        })
                        //


                    } else {
                        window.alert("你没有选中用户");
                    }
                },
                checkUser(item) {
                    console.log("被调用了");
                    let a = $("#checkUser").prop("checked")
                    if (a) {
                        //添加属性
                        item.check = true;
                    } else {
                        item.check = false;
                    }
                },
                selectAll() {
                    let ischeck = $("#selectAll").prop("checked")
                    console.log(ischeck);
                    if (ischeck) {
                        for (let val of this.usersInfo) {
                            val.check = true;
                            console.log(val);
                        }
                        $("input[name='checkbox']").prop("checked", "true");
                    } else {
                        for (let val of (this.usersInfo)) {
                            val.check = false;
                            console.log(val);
                        }
                        $("input[name='checkbox']").removeProp("checked");
                    }
                },
                zipFile() {
                    var source = {
                        "测试导出1": [
                            {
                                "name": "图片名称1",
                                "url": "https://www.baidu.com/link?url=y3R8bxrOnezKtpobVEc6hrqxw13NU262jy87JwF9qMm5TRsICpcQNM4F8xynhWs3661dNavBfZE9ZUMZsDJLV8yUmnUUP0J7d0_hxJVrjelfPkSGeDPiUdlTHbsXTGQ6c_diMpTK4qIpmKLdoFkwQ3PawccYSpuSJnA2m0NcwTX94d-zshk8hqg5VkzBGaoLiCAgNqBNBg5LQ6Jj9Dc4qOGusOU0BZk4xMbcW_iELV6Kn0tVzvl96Qru-7xwGh_08U-vNTBch3ZHB2dwb-4HzdelUhWzj9o_KtRw5Ba25bMwQT8NbkR8EiaL6FbYDYje9q588S9Z3cC3l7Aw-ssoxR0px3bGusXr8QJRLIh8b04cqGnb66F1szmXM18qDPDF9dQtvie1AGpRYtZrEYmWbfHbeGSOtpfKeZ3WyQG23NuAIcu1qobXrJJEL820zcTBARAlNWdp9h67FbD6mnUnkIBqjo6cZDRPPrfZ7UTUR1fobt45bhTjZWwSVLGV2igPstTR9JZxr-CYwkDnzfhOc6y2D5O7_3bJlLHGuVP8G0riH00DEsoLTVYAGdD3YMIS7FzVGk1fuptVdLzVXKn9gJK61oZkK69Al4nJc1CzAlnRGCYU8jUumAL93jaGgY6-L0THI63LXrqMO3w2HhWEACZPpKKA4ESXizvXQbhdqDK&wd=&eqid=efad2411000a233400000006630a26d0"
                            }
                        ],
                        "测试导出2": [
                            {
                                "name": "图片名称2",
                                "url": "https://www.baidu.com/link?url=rIVbFYuBc578XnF-eWUyJ85ah6qWb0-fRvtnha8S4w6qZyoYfvpWAM1utAZXmyRTEM3cH0uSE4zKZARALnZGSxwYUpEqvmKfc04HzZLpMWeKs7Zwj4bZFdTABW3OHE6J346XFe7mpXdbD22cgoL3B-ikDPMHfIJ5k44o8VwvQIBsqlTY44waC9wRDLKbdGfCQ4fhgrnp9fX8x3y_mCxfWF1AcsvoqzAjKi4jz3dE7hBwf9PcytBedwy0otBF05uK2MP3rF4GT08F6Evr0OsxrpX6SccNSFPOSLNjWweiP5D5H1SLrFbedRuJY-a42GPd7j4Yg8Cneq6yNwJb45kqETDLk0bScRLidHkWiJKRJ8-ro6z_-MUWd58V31Y_9DOJ3JSMLt_uU4PmFs5zIZIgeS6ynZLPRSg3x3UW3KQKeXH8viGPGgGgebaBo9fr09fqSYtEH2XNbKmyCuVwwwb7xQ6s3U1BBf-V0owHUnYYQvMB3F2hTrbyMKTsmhl88PkKyYe3i8lMnYvc5ssIBhpHUJReSoTPAwhfIupkA4fhOr4X8SZMEjNJ6Ukx3ZisJFzlGsDPs-x9jIjsvUEKpgnSbiyo8Yui121_oICwgwEusHeY377CZxfRWPUKoo8hOCBS58D0Pcry3Y9rMBCSijg6oK&wd=&eqid=efad2411000a233400000006630a26d0"
                            }
                        ]}

                    this.downloadZipByImageUrlMap(source,"test")
                    },
                        downloadZipByImageUrlMap(source, zipName = 'helloword') {
                            console.log('开始打包');
                            let doneCache = new Map();
                            let zip = new JSZip();
                            for (let dirName of source.keys()) {
                                let fileList = source.get(dirName);
                                let base64List = [];
                                // 缓存已经加载完成的图片base64
                                doneCache.set(dirName, base64List);

                                for (let file of fileList) {
                                    let image = new Image();
                                    // 解决跨域 Canvas 污染问题
                                    image.setAttribute('crossOrigin', 'anonymous');
                                    image.onload = function () {
                                        let canvas = document.createElement('canvas');
                                        canvas.width = image.width;
                                        canvas.height = image.height;

                                        let context = canvas.getContext('2d');
                                        context.drawImage(image, 0, 0, image.width, image.height);

                                        // 得到图片的base64编码数据
                                        let url = canvas.toDataURL();
                                        canvas.toDataURL('image/png');

                                        // 去掉base64编码前的 data:image/png;base64,
                                        base64List.push({
                                            name: file.name,
                                            base64: url.substring(url.indexOf(',') + 1)
                                        });

                                        // 判断图片是否全部加载完成
                                        let ready = true;
                                        for (let key of source.keys()) {
                                            if (doneCache.get(key) === undefined || doneCache.get(key).length < source.get(key).length) {
                                                ready = false;
                                                break;
                                            }
                                        }

                                        if (ready) {
                                            console.log('开始下载');

                                            for (let key of doneCache.keys()) {
                                                let imageList = doneCache.get(key);
                                                let imgDir = zip.folder(key);
                                                for (let k = 0; k < imageList.length; k++) {
                                                    if (imageList[k].base64 === null) {
                                                        continue;
                                                    }
                                                    imgDir.file(imageList[k].name + '_' + k + '.png', imageList[k].base64, { base64: true });
                                                }
                                            }

                                            zip.generateAsync({ type: 'blob' }).then(function (content) {
                                                FileSaver.saveAs(content, zipName + new Date().getTime() + '.zip');
                                            });
                                        }
                                    };
                                    image.onerror = function () {
                                        // 图片加载失败处理方法
                                        for (let dieName of source.keys()) {
                                            let tmpBase64List = doneCache.get(dieName);
                                            for (let file of source.get(dieName)) {
                                                if (image.currentSrc === file.url) {
                                                    tmpBase64List.push(file);
                                                }
                                            }
                                            doneCache.set(dieName, tmpBase64List);
                                        }
                                    };
                                    image.src = file.url;
                                }
                            }
                        }

                },

                async created() {
                    await this.initWx();
                    await this.getMessage()


                }

            })
